import { getCurrentTime } from "@/common/common";
import { useRouter } from "next/router"

export default function Page(props: any) {
   const router = useRouter();

   if(router.isFallback){
      return (<h1>Loading...</h1>)
   }

   const { dt, data } = props;
   return (
      <main>
         <h1>User List {data.id}</h1>
         {!!data?.id &&
            <>
               <h4>{data.title}</h4>
               <h6>{dt}</h6>
               <br />
               <p>{data.body}</p>
            </>
         }
      </main>
   )
}


//指定要生成的id
export async function getStaticPaths() {
   // const response = await fetch('https://dummyjson.com/users');
   // const {users:data} = await response.json();

   return {
      //页面多不建议这么做
      // paths: data.map((item:any)=>{
      //    return { params : {id : item.id.toString()}}
      // }), 

      paths: [
         { params: { id: '1' } },
         { params: { id: '2' } }
      ],

      //这是SSG(服务端生成,不是服务端渲染)
      fallback: true  //true:  false:访问其他id返回404  blocking:按需构建(下次访问的时候就不需要再构建了)
   }
}

export async function getStaticProps(context: any) {
   const dt = getCurrentTime();
   const id = context.params.id;
   const response = await fetch(`https://dummyjson.com/posts/${id}`);
   const data = await response.json();

   return ({
      props: {
         dt,
         data
      }
   })

}